<template>
    <h1 style="text-align: center">{{form.noticeTitle}}</h1>
    <div>
        <quill-editor v-model="form.noticeContent"></quill-editor>
        <div v-html="form.noticeContent"></div>
    </div>
<!--        <el-form ref="noticeRef" :model="form" :rules="rules" label-width="80px">-->
<!--            <el-row>-->
<!--                <el-col :span="12">-->
<!--                    <el-form-item label="公告标题" prop="noticeTitle">-->
<!--                        <el-input v-model="form.noticeTitle" placeholder="请输入公告标题" />-->
<!--                    </el-form-item>-->
<!--                </el-col>-->
<!--                <el-col :span="24">-->
<!--                    <el-form-item label="状态">-->
<!--                        <el-radio-group v-model="form.status">-->
<!--                            <el-radio-->
<!--                                    v-for="dict in sys_notice_status"-->
<!--                                    :key="dict.value"-->
<!--                                    :value="dict.value"-->
<!--                            >{{ dict.label }}</el-radio>-->
<!--                        </el-radio-group>-->
<!--                    </el-form-item>-->
<!--                </el-col>-->
<!--                <el-col :span="24">-->
<!--                    <el-form-item label="内容">-->
<!--                        <editor v-model="form.noticeContent" :min-height="192"/>-->
<!--                    </el-form-item>-->
<!--                </el-col>-->
<!--            </el-row>-->
<!--        </el-form>-->
</template>

<script setup name="myNoticeData">
import { listNotice, getNotice, delNotice, addNotice, updateNotice } from "@/api/system/notice";
import { useRoute } from 'vue-router';

const { proxy } = getCurrentInstance();
const { sys_notice_status, sys_notice_type } = proxy.useDict("sys_notice_status", "sys_notice_type");

const noticeList = ref([]);
const open = ref(false);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref([]);
const single = ref(true);
const multiple = ref(true);
const total = ref(0);
const title = ref("");
const route = useRoute();

const data = reactive({
    form: {
        noticeId: undefined,
        noticeTitle: undefined,
        noticeType: undefined,
        noticeContent: undefined,
        status: "0"
    },
    queryParams: {
        pageNum: 1,
        pageSize: 10,
        noticeTitle: undefined,
        createBy: undefined,
        status: undefined
    },
    rules: {
        noticeTitle: [{ required: true, message: "公告标题不能为空", trigger: "blur" }],
        noticeType: [{ required: true, message: "公告类型不能为空", trigger: "change" }]
    },
});

const { queryParams, form, rules } = toRefs(data);

/** 查询公告列表 */
function getList() {
    loading.value = true;
    listNotice(queryParams.value).then(response => {
        noticeList.value = response.rows;
        total.value = response.total;
        loading.value = false;
    });
}

function getInfo(noticeId) {
    getNotice(noticeId).then(response => {
        console.info(response)
        form.value.noticeTitle=response.data.noticeTitle;
        form.value.noticeContent=response.data.noticeContent;
        getList();
    });
}

/** 取消按钮 */
function cancel() {
    open.value = false;
    reset();
}

/** 表单重置 */
function reset() {
    form.value = {
        noticeId: undefined,
        noticeTitle: undefined,
        noticeType: undefined,
        noticeContent: undefined,
        status: "0"
    };
    proxy.resetForm("noticeRef");
}

getInfo(route.params && route.params.noticeId)

</script>
